<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<base href="<%=basePath%>" />
<jsp:include page="/jsp/common.jsp" />
<jsp:include page="/jsp/tableHead.jsp" />
<link rel="stylesheet" type="text/css" href="<%=basePath%>resource/css/order.css" />
<script type="text/javascript">
$().ready(function(){

	var option = {
			head : [
					{name:"images",title:"图片",type:"text",width:50},
		            {name:"name",title:"商品",type:"text",width:541},
		            {name:"cost",title:"单价",type:"text",width:76},
		            {name:"count",title:"数量",type:"text",width:56},
		            {name:"total",title:"小计",type:"text",width:136},
		            {name:"product_id",title:"产品",type:"text",width:0},
		            {name:"operation",title:"操作",type:"text",width:36}
		            ],
            searchURL : "<%=basePath %>user/cartGood_list.do",
            deleteURL : "<%=basePath %>user/cartGood_delete.do",
            table_Option : {
                "class" : "QTable_table_01",
				head : {sortable: false, selectAll: {require:false}},
				row : { selectable : false },
				foot : { require : false, pageNum : 1, pageSize : 100}
			},
            queryFn : function(_option){
                
				var $table = QTable.get("#listTable"),
					$search = QSearch.get(option.searchURL),
					pageSize = 100,
					pageNum = 1;
		
				$search.setPageNum(pageNum);
				$search.setPageSize(pageSize);
				$search.doSearch();
    		},
    		successFn : function(_result){

    			//var $tabale = $("#listTable");
    			var $table = QTable.get("#listTable");
    			$table.refresh(_result);

    			var rows = $table.getRows();
    			for(var i=0, len=rows.length; i<len; i+=1){
        			
        			var $td = $(rows[i].getItem("images")).empty(),
        				data = rows[i].getData(),
        				product = data.product,
        				images = product.images || [];

        			/*处理图片*/
    				if(images.length > 0){
    					var $img = $("<img/>").attr("src", images[0]["url"]).attr("title", images[0]["title"]);
        				$td.append($img);
    				}

    				/*处理商品名称*/
    				$td = $(rows[i].getItem("name")).empty();
    				var $a = $("<a/>").attr("href", "<%=basePath %>user/product_info.do?id=" + product.id);
    				$td.append($a.html(product["name"]));

    				/*处理价格*/
    				$td = $(rows[i].getItem("cost")).empty();
    				var $span = $("<span>").attr("id", "QRow_Cost_" + rows[i].getData()["id"]).attr("value", product["price"]);
    				$td.append($span.html("￥" + product["price"]));
    				
    				/*处理数量*/
    				$td = $(rows[i].getItem("count")).empty();
    				var count = rows[i].getData().count || 1;
    					$input = $("<input type='text' maxlength='4' onpaste='return false;' onchange='stat_row(" + rows[i].getData()["id"] +")'/>").attr("value", count),
    					$input.addClass("quantity").attr("id", "QRow_Count_" + rows[i].getData()["id"]),
    					$div = $("<div />"),
    					$span1 = $(["<span class='increase' ",
     	    					" onclick='increase(" + rows[i].getData()["id"] +")' ",
     	    					" onselectstart='return false;' ",
     	    					" >&nbsp;</span> "].join()),
    					$span2 = $("<span class='decrease' onclick='decrease(" + rows[i].getData()["id"] +")' onselectstart='return false;'>&nbsp;</span>");
   					$span1.bind("click", function(){

   					});

    				$div.append($span1).append($span2);
    				$td.append($input).append($div);

    				/*处理小计*/
    				$td = $(rows[i].getItem("total")).empty();
    				var $span = $("<span>").attr("id", "QRow_Total_" + rows[i].getData()["id"]),
    					total = (parseFloat(product["price"]) * count);

    				$span.attr("value", total);
    				$td.append($span.html("￥" + total));
    			}
    			stat_total();
    			return;
    			for(var i=0, len=_result.page.length; i<len; i+=1){

    				var row = _result.page[i],
    					product = row.product,
    					images = product.images || [];

    				/*处理图片*/
    				if(images.length > 0){
    					var $img = $("<img/>").attr("src", images[0]["url"]).attr("title", images[0]["title"]);
        				row["images"] = $img.prop("outerHTML");
    				}

    				/*处理商品名称*/
    				var $a = $("<a/>").attr("href", "<%=basePath %>user/product_info.do?id=" + product.id);
    				$a.html(product["name"]);
    				row["name"] = $a.prop("outerHTML");

    				/*处理价格*/
    				var $span = $("<span>").attr("id", "QRow_Cost_" + row["id"]).attr("value", product["price"]);
    				row["cost"] = $span.html("￥" + product["price"]).prop("outerHTML");
    				
    				/*处理数量*/
    				var count = row.count || 1;
    					$input = $("<input type='text' maxlength='4' onpaste='return false;' onchange='stat_row(" + row["id"] +")'/>").attr("value", count),
    					$input.addClass("quantity").attr("id", "QRow_Count_" + row["id"]),
    					$div = $("<div />"),
    					$span1 = $(["<span class='increase' ",
     	    					" onselectstart='return false;' ",
     	    					" >&nbsp;</span> "].join()),
    					$span2 = $("<span class='decrease' onselectstart='return false;'>&nbsp;</span>");

    				$div.append($span1).append($span2);
    				row["count"] = $input.prop("outerHTML") + $div.prop("outerHTML");

    				/*处理小计*/
    				var $span = $("<span>").attr("id", "QRow_Total_" + row["id"]),
    					total = (parseFloat(product["price"]) * count);

    				$span.attr("value", total);
    				row["total"] = $span.html("￥" + total).prop("outerHTML");

    				if(!default_Option.operation.useable) continue;
    				
    				if(default_Option.operation["delete"]){
    					var $a = $("<a/>").attr("href", "javascript:default_Option.rowDeleteFn(null," + row["id"] + ")").html("删除");
    					row["operation"] = "&nbsp;" + $a.prop("outerHTML");
    				}
    			}
    			QTable.get("#listTable").refresh(_result);
    			stat_total();
    			$("#pageTotal").html(_result.total);
    		},
    		callback_del : function(_id){
    			var table = QTable.get("#listTable");
    			table.deleteRow(_id);
    			stat_total();
    			return true;
    		}
       };
	initTable(option);

	increase = function(_id){
		var $input = $("#QRow_Count_" + _id),
			_val = $input.val();
		if(isNaN(_val)){
			$input.val(1);
		} else {
			$input.val(parseInt(_val) + 1);
		}
		stat_row(_id);
	};

	decrease = function(_id){
		var $input = $("#QRow_Count_" + _id),
			_val = $input.val();
		if(isNaN(_val) || _val < 2){
			$input.val(1);
		} else {
			$input.val(parseInt(_val) - 1);
		}
		stat_row(_id);
	}

	stat_row = function(_id){

		var $cost = $("#QRow_Cost_" + _id),
			$count = $("#QRow_Count_" + _id),
			$total = $("#QRow_Total_" + _id),
			total = parseFloat($cost.attr("value")) * parseInt($count.val());
		$total.attr("value", total).html("￥" + total);

		stat_total();

		if(window["process" + _id]){
			clearTimeout(window["process" + _id]);
		}
		window["process" + _id] = setTimeout(" changeCart(" + _id +") " , 2000 );
	}

	stat_total = function(){

		var table = QTable.get("#listTable"),
			ids = table.getRowIds(),
			total = 0;

		for(var i=0, len=ids.length; i<len; i+=1){
			total += parseFloat($("#QRow_Total_" + ids[i]).attr("value"));
		}
		$("#total_price").html("￥" + total + "元");
		$("#total_point").html(Math.floor(total/10));
		return total;
	}

	changeCart = function(_id){

		var url = "<%=basePath %>user/cartGood_update.do",
		data = {
			id : _id,
			count : $("#QRow_Count_" + _id).val()
		},
		callback_Fn = function(_result){
			if(_result.type == "error"){
				alert(_result.content);
			}
		};
		$.post(url, data, callback_Fn, "json");
	}
});

function pay(){

	var $table = QTable.get("#listTable"),
		rows = $table.getRows(),
		url = "<%=basePath %>user/order_check.do?";
	
	for(var i=0, len=rows.length; i<len; i+=1){
		url += "product_id=" + rows[i].getData()["product_id"] + "&";
		var $count = $("#QRow_Count_" + rows[i].getData()["id"]);
		url += "product_count=" + parseInt($count.val()) + "&";
	};
	url += "total=" + stat_total();
	window.location.href = url;
}
</script>
</head>
<body>
<jsp:include page="../header.jsp" />
<div class="content">
<div class="bar">
	<div class="title title_list">
		<ul>
			<li class="current">查看购物车</li>
			<li>订单信息</li>
			<li>完成订单</li>
		</ul>
	</div>
	<table id="listTable"></table>
	<div class="total">
		赠送积分: 
		<em id="total_point"></em>
		商品金额:
		<strong id="total_price"></strong>
	</div>
	<div class="bottom">
		<a href="javascript:;" class="clear">清空购物车</a>
		<a href="javascript:pay();" class="submit">提交订单</a>
	</div>
</div>
</div>
<jsp:include page="../footer.jsp" />
</body>
</html>